<template>
  <div>
    <Header_h />
    <div class="Breadcrumbs-w">
      <div class="container">
        <el-button size="mini" class="pubBtn3" type="button" @click="$router.back()">返回</el-button>
      </div>
      <div class="content">
        <div class="popup" v-if="!isLogin">
          <p>你正在查看试读版文件，如想查看完整版文件请登录平台</p>
          <div class="pdf-login" @click="$router.push('/web/guanjia')">
            <p>登录平台</p>
          </div>
        </div>
        <iframe :src="pdfUrl" style="width: 1204px; height: 100%"></iframe>
      </div>
    </div>
    <Footer />
  </div>
</template>

<script>
import Header_h from "@/components/Header_h";
import Footer from "@/components/Footer";
import Cookies from "js-cookie";
export default {
  data: () => {
    return {
      isLogin: false,
      pdfUrl: "",
    };
  },
  mounted () {
    const token = Cookies.get("sq_token");
    this.isLogin = Boolean(token);
    // console.log(this.$route.query);
    this.pdfUrl = this.isLogin
      ? this.$route.query.complete_file
      : this.$route.query.try_file
    // this.pdfUrl = this.isLogin
    //   ? "http://patent.oramage.com//storage/uploads/20210927/a49fbff1ddb740eed87fc4ee8e30e87f.pdf"
    //   : "http://patent.oramage.com//storage/uploads/20210927/9e7326b797878cc52f713c2a13e69880.pdf";
  },
  methods: {},
  components: {
    Header_h,
    Footer,
  },
};
</script>

<style lang="less" scoped>
.content {
  height: 608px;
  margin-top: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  .popup {
    height: 113px;
    width: 412px;
    background-color: #f3f3f3;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-15%) translateY(130%);
    z-index: 10;
    bottom: 30px;
    border-radius: 10px;
    p {
      color: #333333;
      font-size: 14px;
      height: 24px;
      margin-left: 27px;
      margin-right: 35px;
      margin-top: 25px;
    }
    .pdf-login {
      cursor: pointer;
      width: 131px;
      height: 38px;
      background-color: #205ffc;
      border-radius: 19px;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translateX(-50%) translateY(-50%);
      margin-top: 15px;
      p {
        color: #ffffff;
        font-size: 16px;
        margin-top: 10px;
        padding-left: 5px;
      }
    }
  }
}
// .pdf-login {
//   position: absolute;
//   z-index: 10;
//   bottom: 30px;
// }
.Breadcrumbs-w {
  background-color: #f4f5f7;
  width: 100%;
  margin-top: 80px;
  padding: 10px 0;
}
</style>